@import "~terriajs-variables";
@import "../Sass/common/mixins";

.loader {
  padding: $padding-small $padding-small $padding-small 30px;
  position: relative;
  display: inline-block;
  font-family: $font-base;
  svg {
    height: 15px;
    width: 15px;
    margin: 5px;
    display: line-block;
    position: absolute;
    left: $padding-small;
    top: $padding-small;
    -webkit-animation: spin 2s infinite linear;
    animation: spin 2s infinite linear;
    fill: inherit;
  }
  span {
    line-height: 1.8;
    font-size: 14px;
  }
}

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}

@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
